<template>
  <div>
    <van-nav-bar title="黑马商城" left-text="返回" left-arrow border class="topNav" :fixed="true" @click-left="goback"/>

    <router-view></router-view>

    <van-tabbar route border>
      <van-tabbar-item replace to="/homepage">
        <div class="iconfont icon-home"></div>首页
      </van-tabbar-item>
      <van-tabbar-item replace to="/vip">
        <div class="iconfont icon-huiyuan"></div>会员
      </van-tabbar-item>
      <van-tabbar-item replace to="/cart" :info="cartList.length || '' ">
        <div class="iconfont icon-shopping_cart"></div>购物车
      </van-tabbar-item>
      <van-tabbar-item replace to="/search">
        <div class="iconfont icon-sousuo"></div>搜索
      </van-tabbar-item>
      <van-tabbar-item icon="coupon-o" to="/category">分类</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
import { mapState } from 'vuex'
export default {
  data () {
    return {}
  },
  mounted () {
    // this.$http.get('/login', { params: { username: 'admin', password: '123456' } })
    //   .then(res => console.log(res))
    //   .catch(res => console.log('object'))
  },
  methods: {
    goback () {
      console.log(location.hash)
      if (location.hash === '#/news') {
        this.$router.push('/homepage')
      } else if (location.hash === '#/newsinfo') {
        this.$router.push('/news')
      } else if (location.hash === '#/photosharing') {
        this.$router.push('/homepage')
      } else if (location.hash === '#/photoinfo') {
        this.$router.push('/photosharing')
      } else if (location.hash === '#/goodsrecommend') {
        this.$router.push('/goodsinfo')
      } else if (location.hash === '#/goodsinfo') {
        this.$router.push('/goods')
      } else if (location.hash === '#/goods') {
        this.$router.push('/homepage')
      } else if (location.hash === '#/search') {
        this.$router.push('/homepage')
      } else if (location.hash === '#/addition') {
        this.$router.push('/search')
      } else if (location.hash === '#/category') {
        this.$router.push('/homepage')
      } else if (location.hash === '#/categoryselect') {
        this.$router.push('/category')
      } else if (location.hash === '#/vip') {
        this.$router.push('/homepage')
      }
    }
  },
  computed: {
    ...mapState(['cartList'])
  }
}
</script>

<style scoped lang="less">
.van-tabbar-item {
  text-align: center;
}
.van-nav-bar {
  background-color: #1989fa;

  .van-nav-bar__left {
    .van-icon {
      color: #fff !important;
    }
    .van-nav-bar__text {
      color: #fff;
      background-color: #1989fa;
    }
  }
  .van-nav-bar__title {
    color: #fff;
  }
}
</style>
